<template>
  <el-form ref="ruleFormRef" label-position="top" :model="formInline" :rules="formRules" label-width="auto"
    v-loading="isLoading">
    <el-row :gutter="30">
      <re-col :value="12" :xs="24" :sm="24" v-if="type == 1">
        <el-form-item label="设备序列号" prop="deviceSN">
          <el-input v-model.trim="formInline.deviceSN" clearable :placeholder="prompt?.deviceSN"
            @input="devicechange" />
        </el-form-item>
      </re-col>
      <re-col :value="12" :xs="24" :sm="24">
        <el-form-item :label="titles?.deviceName" prop="deviceName">
          <el-input :maxlength="30" :show-word-limit="true" class="mr-[20px]" v-model.trim="formInline.deviceName"
            clearable :placeholder="prompt?.deviceName" />
        </el-form-item>
      </re-col>
      <re-col :value="12" :xs="24" :sm="24" v-if="type == 1">
        <el-form-item :label="titles?.systematicId" prop="systematicId" :key="syskey">
          <el-select v-model="formInline.systematicId" placeholder="请选择所属系统">
            <el-option v-for="item in systemlist" :key="item.systematicId" :label="item.systematicName"
              :value="item.systematicId" />
          </el-select>
        </el-form-item>
      </re-col>
      <re-col :value="12" :xs="24" :sm="24" v-if="type == 1">
        <el-form-item label="产品信息" prop="productName">
          {{
            formInline.productName == null || !formInline.productName
              ? "--"
              : formInline.productName
          }}
        </el-form-item>
      </re-col>
      <re-col :value="12" :xs="24" :sm="24" v-if="type == 1">
        <el-form-item label="到期时间" prop="expireDate">
          {{
            formInline.expireDate == null || !formInline.expireDate
              ? "--"
              : formInline.expireDate
          }}
        </el-form-item>
      </re-col>
      <re-col :value="12" :xs="24" :sm="24" v-if="type == 2">
        <el-form-item label="用传主机" prop="gatewayId">
          <getGatewayops :gatewayType="type" style="width: 100%" v-model="formInline.gatewayId" />
        </el-form-item>
      </re-col>
      <re-col :value="12" :xs="24" :sm="24" v-if="type == 2">
        <el-form-item label="产品类型" prop="productId">
          <gatewayproduct :gatewayType="type" style="width: 100%" v-model="formInline.productId"
            @change="getdatadeviceinfo" />
        </el-form-item>
      </re-col>
      <re-col :value="12" :xs="24" :sm="24" v-if="type == 2">
        <el-form-item :label="titles?.systematicId" prop="systematicId" :key="syskey">
          <el-select v-model="formInline.systematicId" placeholder="请选择所属系统">
            <el-option v-for="item in systemlist" :key="item.id" :label="item.systematicName" :value="item.id" />
          </el-select>
        </el-form-item>
      </re-col>
      <re-col :value="12" :xs="24" :sm="24">
        <el-form-item :label="titles?.status" prop="status">
          <el-radio-group v-model="formInline.status">
            <el-radio v-for="item in STRATEGYSTATUS" :key="item.value" :value="item.value" :label="item.label">
            </el-radio>
          </el-radio-group>
        </el-form-item>
      </re-col>
      <re-col :value="24" :xs="12" :sm="24">
        <el-form-item :label="titles?.position" prop="position">
          <el-radio-group :disabled="!isEdit" v-model="formInline.position" @change="changePosition">
            <el-radio v-for="item in ROOM_STATUS" :key="item.value" :value="item.value">
              {{ isNullOrEmpty(item.label) }}
            </el-radio>
          </el-radio-group>
        </el-form-item>
      </re-col>
      <re-col :value="12" :xs="24" :sm="24" v-if="formInline.position == 1">
        <el-form-item :label="titles?.buildingId" prop="buildingId">
          <building :disabled="!isEdit" v-model.trim="formInline.buildingId" clearable
            @change="formInline.drawingId = null" :placeholder="prompt?.buildingId" :style="{ width: '100%' }"
            @blur="formValidateField(ruleFormRef, 'buildingId')">
          </building>
        </el-form-item>
      </re-col>
      <re-col :value="12" :xs="24" :sm="24" v-if="formInline.position == 1">
        <el-form-item :label="titles?.drawingId" prop="drawingId">
          <floors v-model.trim="formInline.drawingId" clearable :disabled="!isEdit" :buildingId="formInline.buildingId"
            :placeholder="prompt?.drawingId" :style="{ width: '100%' }" @change="images"
            @blur="formValidateField(ruleFormRef, 'drawingId')">
          </floors>
        </el-form-item>
      </re-col>
      <re-col :value="24" :xs="12" :sm="24" v-if="formInline.position == 1">
        <el-form-item label="室内位置" prop="">
          <div class="flex w-[100%]">
            <el-input class="mr-[20px]" v-model.trim="formInline.place" clearable placeholder="请输入" />
            <el-button class="" type="primary" @click="openPositionMark">图纸标记</el-button>
          </div>
        </el-form-item>
      </re-col>
      <re-col :value="12" :xs="12" :sm="24" v-if="formInline.position == 2">
        <el-form-item :label="titles?.drawingPoint" prop="">
          <el-button class="" type="primary" @click="openPositionMark">图纸标记</el-button>
        </el-form-item>
      </re-col>
      <re-col :value="24" :xs="12" :sm="24" v-if="formInline.position == 2">
        <el-form-item label="室外位置" prop="">
          <div class="flex w-[100%]">
            <el-input class="mr-[16px]" v-model.trim="formInline.place" clearable placeholder="请输入" />
            <el-button class="" type="primary" @click="openDialog('选择地图')">地图标记</el-button>
          </div>
        </el-form-item>
      </re-col>
      <re-col :value="12" :xs="24" :sm="24">
        <el-form-item :label="titles?.addressCode" prop="rate">
          <el-input v-model.trim="formInline.addressCode" clearable :placeholder="prompt?.addressCode" />
        </el-form-item>
      </re-col>

      <!-- <re-col :value="12" :xs="24" :sm="24">
        <el-form-item :label="titles?.expireDate" prop="expireDate">
          <el-date-picker
            class="pickerW"
            value-format="YYYY-MM-DD"
            v-model="formInline.expireDate"
            type="date"
            :placeholder="prompt?.expireDate"
          />
        </el-form-item>
      </re-col> -->
      <re-col :value="12" :xs="24" :sm="24">
        <el-form-item :label="titles?.rate" prop="rate">
          <div class="flex items-center gap-[10px]">
            <el-input v-model.trim="formInline.rate" type="number" clearable :placeholder="prompt?.rate" />
            <div class="whitespace-nowrap text-[#999]">秒，不填采用默认值</div>
          </div>
        </el-form-item>
      </re-col>

      <re-col :value="12" :xs="24" :sm="24" v-if="type == 1">
        <el-form-item label="联网模式" prop="netWorkMode">
          <!-- 单选框 -->
          <el-radio-group v-model="formInline.netWorkMode" @change="changelwmodel">
            <el-radio :label="1">流量卡</el-radio>
            <el-radio :label="2">网关</el-radio>
            <el-radio :label="3">其他</el-radio>
          </el-radio-group>
        </el-form-item>
      </re-col>
      <re-col :value="12" :xs="24" :sm="24" v-if="formInline.netWorkMode == 2 && type == 1" prop="gatewayId">
        <el-form-item :label="titles?.gatewayId" prop="gatewayId">
          <getGatewayops :gatewayType="type" style="width: 100%" v-model="formInline.gatewayId"
            @blur="formValidateField(ruleFormRef, 'gatewayId')" />
        </el-form-item>
      </re-col>
      <re-col :value="12" :xs="24" :sm="24" v-if="formInline.netWorkMode == 1 && type == 1" prop="flowCardId">
        <el-form-item :label="titles?.flowCardId" prop="flowCardNum">
          <el-input v-model.trim="formInline.flowCardNum" @input="inputchange" clearable
            :placeholder="prompt?.flowCardId" />
        </el-form-item>
      </re-col>
      <re-col :value="12" :xs="24" :sm="24">
        <el-form-item :label="titles?.monitorId" prop="">
          <div class="flex w-[100%]">
            <getMonitorops style="width: 100%" v-model="formInline.monitorId" />
            <el-button class="ml-[16px]" type="primary" @click="openVideoMark">选择</el-button>
          </div>
        </el-form-item>
      </re-col>
      <re-col :value="12" :xs="24" :sm="24">
        <el-form-item :label="titles?.dutyUid" prop="dutyUid">
          <!-- <el-select
            v-model="formInline.dutyUid"
            :placeholder="prompt?.dutyUid"
          >
            <el-option
              v-for="item in cycleValueoptions"
              :key="item.value"
              :label="item.lable"
              :value="item.value"
            />
          </el-select> -->
          <authorizeuserproject v-model="formInline.dutyUid" clearable :projectId="operate.checkedProject" :isid="1"
            placeholder="请选择" :style="{ width: '100%' }" @blur="formValidateField(ruleFormRef, 'dutyUid')" />
        </el-form-item>
      </re-col>
      <!-- <re-col :value="12" :xs="12" :sm="12">
        <el-form-item label="设备图标" prop="deviceIconInfo">
          <getDeviceTypeopsa v-model="formInline.deviceIconInfo" clearable placeholder="请选择" :style="{ width: '100%' }"
            @blur="formValidateField(ruleFormRef, 'deviceIconInfo')" />
        </el-form-item>
      </re-col> -->
      <re-col :value="24" :xs="24" :sm="24">
        <el-form-item :label="titles?.deviceImg" prop="deviceImg">
          <ReUpload v-model:files="formInline.deviceImg" :limit="1"></ReUpload>
        </el-form-item>
      </re-col>
      <re-col :value="24" :xs="24" :sm="24">
        <el-form-item :label="titles?.remark" prop="remark">
          <el-input type="textarea" v-model="formInline.remark" clearable :placeholder="prompt?.remark" />
        </el-form-item>
      </re-col>
    </el-row>
  </el-form>
</template>

<script setup lang="ts">
import { isNullOrEmpty } from "@/utils/functions";
import { usePoints } from "@/common/points";
import { getflowcardmsg } from "@/api/operate/gateway-administration/index";
import drawingPoints from "@/components/positionSelect/drawingPoints.vue";
import authorizeuserproject from "@/components/select/authorizeuser/authorizeuserproject.vue";
import getDeviceTypeopsa from "@/components/select/getDeviceTypeops/getDeviceTypeops.vue";
import getGatewayops from "@/components/select/getGatewayops/getGatewayops.vue";
import gatewayproduct from "@/components/select/gatewayproduct/gatewayproduct.vue";
import getMonitorops from "@/components/select/getMonitorops/getMonitorops.vue";
import { STRATEGYSTATUS } from "@/constant/device-mangenment";
import ReUpload from "@/components/ReUpload/index.vue";
import { getDeviceBySn } from "@/api/operate/device-management/index";
import {
  cloneDeep,
  isAllEmpty,
  deviceDetection,
  debounce
} from "@pureadmin/utils";
import { getInfo as settingInfo } from "@/api/operate/project-management/projectManagement/setting";
import { getInfo as drawingInfo } from "@/api/operate/project-management/project-management/drawing-management/index";
import { usePageVariablesStoreHook } from "@/store/modules/pageVariables";
const operate = usePageVariablesStoreHook().getOperate();
import mapForm from "@/components/mapForm/map.vue";
import { ref, reactive } from "vue";
import { ROOM_STATUS, ISINSPECTION_TYPE, SSSS } from "@/constant/group";
import { addDialog } from "@/components/ReDialog";
import { ElMessage, ElMessageBox } from "element-plus";
import ReCol from "@/components/ReCol";
import type { FormRules } from "element-plus";
import { titles, prompt } from "./index";
import {
  getDeviceTypeops,
  gatewaysystemtic
} from "@/api/operate/device-management/index";
import building from "@/components/select/building/building.vue";
import floors from "@/components/select/floors/floors.vue";
import type { infoType } from "@/api/operate/device-management/index";
import { formValidateField } from "@/utils/functions";
const wifilwk = ref(1);
const ismapMarking = ref(false);
type FormProps = {
  formInline: infoType;
  isLoading: boolean;
  isEdit: boolean;
  type: Number;
  originMarker: Array | Object;
};
const formState = reactive({
  center: [],
  drawingPoint: {}
});
const iconlist = ref([]);

const systemlist = ref([]);
const cycleValueoptions = [
  {
    value: 1,
    lable: "周"
  },
  {
    value: 2,
    lable: "月"
  },
  {
    value: 3,
    lable: "年"
  }
];
const props = withDefaults(defineProps<FormProps>(), {
  formInline: () => ({}) as infoType,
  isLoading: false,
  isEdit: false,
  type: 0,
  originMarker: () => { }
});

const formRules = reactive(<FormRules>{
  netWorkMode: [{ required: true, message: "请选择联网模式", trigger: "blur" }],
  buildingId: [
    { required: true, message: prompt?.buildingId, trigger: "blur" }
  ],
  gatewayId: [{ required: true, message: prompt?.buildingId, trigger: "blur" }],
  status: [{ required: true, message: prompt?.status, trigger: "blur" }],
  position: [{ required: true, message: "请选择位置类型", trigger: "blur" }],
  systematicId: [
    { required: true, message: prompt?.systematicId, trigger: "blur" }
  ],
  deviceIconInfo: [
    { required: true, message: "请选择设备图标", trigger: "blur" }
  ],
  drawingId: [{ required: true, message: prompt?.drawingId, trigger: "blur" }],
  monitorId: [{ required: true, message: prompt?.monitorId, trigger: "blur" }],
  dutyUid: [{ required: true, message: prompt?.dutyUid, trigger: "blur" }],
  deviceSN: [
    { required: true, message: prompt?.deviceSN, trigger: "blur" },
    {
      pattern: /^[0-9a-zA-Z]+$/,
      trigger: "change",
      message: "只能输入数字和字母"
    },
    {
      pattern: /^[A-Za-z0-9]{10,16}$/,
      trigger: "change",
      message: "序列号应为10-16位"
    }
  ],
  productId: [{ required: true, message: prompt?.productId, trigger: "blur" }],
  // deviceName: [{ required: true, message: prompt?.deviceName, trigger: "blur" }],
  flowCardNum: [
    { required: true, message: prompt?.buildingId, trigger: "blur" },

    {
      pattern: /^[0-9a-zA-Z]+$/,
      trigger: "change",
      message: "只能输入数字和字母"
    },
    {
      pattern: /^[A-Za-z0-9]{10,16}$/,
      trigger: "change",
      message: "流量卡号应为10-16位"
    }
  ]
});
const ruleFormRef = ref();
const formRef = ref();
function getRef() {
  return ruleFormRef.value;
}
const mapMarking = () => {
  ismapMarking.value = true;
};
let timer = null;
function throttle(fn, delay) {
  if (timer == null) {
    timer = setTimeout(() => {
      fn();
      clearTimeout(timer);
      timer = null;
    }, delay);
  }
}
const devicechange = e => {
  if (e == null || e.length < 10) {
    props.formInline.productId = null;
    props.formInline.productName = null;
    props.formInline.expireDate = null;
    systemlist.value = [];
    props.formInline.systematicId = null;
    return;
  }
  props.formInline.projectId = operate.checkedProject;
  props.formInline.unityId = operate.checkedUnitId;
  throttle(getdatadeviceinfo, 1000);
};
const changelwmodel = e => {
  if (e == 2) {
    props.formInline.flowCardId = null;
    props.formInline.flowCardNum = null;
  } else {
    props.formInline.gatewayId = null;
  }
};
const inputchange = e => {
  if (e == null || e.length < 10) {
    props.formInline.flowCardId = null;
    return;
  }
  throttle(getflowcardinfo, 1000);
};
const getflowcardinfo = () => {
  getflowcardmsg({ flowCardNum: props.formInline.flowCardNum }).then(res => {
    if (res.code == 200) {
      const nows = new Date();
      const resdata: any = res.result;
      let timeis = nows.getTime() - new Date(resdata.expireDate).getTime();
      if (
        resdata.flowCardId !== 0 &&
        resdata.expireDate !== "" &&
        resdata.status !== 1
      ) {
        if (timeis > 0) {
          ElMessage.error("当前流量卡已过期");
          props.formInline.flowCardId = null;
          return;
        }
        props.formInline.flowCardId = resdata.flowCardId;
      } else {
        props.formInline.flowCardId = null;
        ElMessage.error("当前流量卡不可用");
      }
    }
  });
};
const syskey = ref(0);
const getdatadeviceinfo = () => {
  if (props.type == 1) {
    getDeviceBySn(props.formInline).then(res => {
      if (res.code == 200) {
        const resdata: any = res.result.productInfo;
        if (resdata.systematicId !== 0 && resdata.productId !== 0) {
          props.formInline.productId = resdata.productId;
          props.formInline.productName = resdata.productName;
          props.formInline.expireDate = resdata.expireDate;
          props.formInline.modelId = resdata.modelId;
          systemlist.value = res.result.systemInfo;
          syskey.value++;
        } else {
          props.formInline.productId = null;
          props.formInline.productName = null;
          props.formInline.expireDate = null;
          props.formInline.modelId = "";
          systemlist.value = [];
          props.formInline.systematicId = null;
          ElMessage.error("序列号不可用");
        }
      }
    });
  } else {
    gatewaysystemtic({ productId: props.formInline.productId }).then(res => {
      if (res.code == 200) {
        systemlist.value = res.result.data;
        props.formInline.projectId = operate.checkedProject;
        props.formInline.unityId = operate.checkedUnitId;
        syskey.value++;
      } else {
        props.formInline.productId = null;
        props.formInline.productName = null;
        props.formInline.expireDate = null;
        props.formInline.modelId = "";
        systemlist.value = [];
        props.formInline.systematicId = null;
        ElMessage.error("产品类型不可用");
      }
    });
  }
};
const labelMarkers = ref(); //已经标记过的点位
const openDialog = (title = "项目编辑") => {
  const formState = reactive({
    center: [],
    drawingPoint: {}
  });
  formState.center = [
    props.formInline.markPoint.lng,
    props.formInline.markPoint.lat
  ];
  let bg = ref();
  let bounds = ref();
  settingInfo().then(res1 => {
    bg.value = res1.result.projectPlan;
    bounds.value = res1.result.bounds;

    addDialog({
      title: "地图标记",
      width: "800px",
      draggable: true,
      props: {
        center: formState.center,
        isEdit: true,
        showCreatePoly: false,
        labelMarkers: labelMarkers.value,
        image: bg.value,
        bounds: bounds.value
      },
      fullscreen: deviceDetection(),
      fullscreenIcon: true,
      closeOnClickModal: false,
      contentRenderer: () =>
        h(mapForm, {
          ref: formRef,
          "onUpdate:center": val => {
            formState.center = val;
          }
        }),
      open: ({ options, index }) => {
        //获取已经标记过的点位
        usePoints("device")
          .getMapPoints(operate.checkedProject, true, formState.center)
          .then(res => {
            formRef.value.setLabelMarkers(res);
          });
      },
      beforeSure: (done, { options }) => {
        props.formInline.markPoint.lng = formState.center[0];
        props.formInline.markPoint.lat = formState.center[1];
        done();
      }
    });
  });
};
//获取图纸
const bgImg = ref();
const getImg = () => {
  console.log(props.formInline, "详情数据");
  //如果是室内
  drawingInfo({ id: props.formInline.drawingId }).then(res => {
    if (res.code == 200) {
      bgImg.value = res.result.img;
      //  console.log("huoss",bgImg.value,res);
    }
  });
};
const getSettinginfo = () => {
  settingInfo().then(res => {
    if (res.code == 200) {
      bgImg.value = res.result.projectPlan;
    }
  });
};

const drawingPointsRefs = ref();
//图纸标记
const openPositionMark = () => {
  let changeMarker = [];
  const dp = props.formInline.drawingPoint;
  // console.log("dp", dp);
  if (Object.keys(dp).length > 2 && dp.lat !== "" && dp.lng !== "") {
    changeMarker = [dp];
    // console.log("dpa", changeMarker);
  }
  addDialog({
    title: `图纸标点`,
    width: "1100px",
    draggable: true,
    props: {
      formInline: props.formInline,
      isShowPopup: false,
      bgImg: bgImg.value,
      changeMarker: changeMarker, //添加，修改的标点
      markerArr: [] //已经添加过的标点
      // bgImg: 'https://ts3.cn.mm.bing.net/th?id=OIP-C.OhUOhPbzdELTIt6QY9fV0AHaEo&w=316&h=197&c=8&rs=1&qlt=90&o=6&dpr=1.1&pid=3.1&rm=2',
    },
    fullscreen: deviceDetection(),
    fullscreenIcon: true,
    closeOnClickModal: false,
    contentRenderer: () =>
      h(drawingPoints, {
        ref: drawingPointsRefs,
        "onUpdate:changeMarker": val => {
          console.log(val, "sdsfasdf");
          if (val.length > 0) {
            formState.drawingPoint = val[0];
          }
          // console.log("onUpdate", formState.drawingPoint, val);
        }
      }),
    open: ({ options, index }) => {
      usePoints("device")
        .getMarkerPoints(true, props.originMarker, {
          projectId: operate.checkedProject,
          drawingId:
            props.formInline.position == 1 ? props.formInline.drawingId : "",
          buildingId:
            props.formInline.position == 1 ? props.formInline.buildingId : ""
        })
        .then(res => {
          drawingPointsRefs.value.setFixedMarkers(res);
        });
    },
    beforeSure(done, { options, index }) {
      props.formInline.drawingPoint = formState.drawingPoint;
      done(); // 关闭弹框
    }
  });
};
const formStates = reactive({
  center: [],
  drawingPoint: {}
  // area:[]
});
//关联监控
//选择的监控数据
let changeviedo = ref(null);
let changeMarker = [];
const openVideoMark = () => {
  addDialog({
    title: `视频选择`,
    width: "1100px",
    draggable: true,
    props: {
      formInline: props.formInline,
      selectedAble: true,
      editAble: false,
      isShowPopup: true,
      iconUrl: "monitor",
      changeMarker: changeMarker, //添加，修改的标点
      markerArr: [], //已经添加过的标点
      bgImg: bgImg.value
    },
    fullscreen: deviceDetection(),
    fullscreenIcon: true,
    closeOnClickModal: false,
    contentRenderer: () =>
      h(drawingPoints, {
        ref: drawingPointsRefs,
        onMarkerClick: val => {
          changeviedo.value = val;
        }
      }),
    open: ({ options, index }) => {
      //获取已经标记过的点位
      usePoints("video")
        .getMarkerPoints(true, changeMarker, {
          projectId: operate.checkedProject,
          drawingId:
            props.formInline.position == 1 ? props.formInline.drawingId : "",
          buildingId:
            props.formInline.position == 1 ? props.formInline.buildingId : ""
        })
        .then(res => {
          drawingPointsRefs.value.setFixedMarkers(res);
        });
    },
    beforeSure(done, { options, index }) {
      if (changeviedo.value == null) {
        ElMessage.warning("请选择监控点位");
        return;
      } else {
        props.formInline.monitorId =
          changeviedo.value[0]?.markerItem?.monitorId * 1;
        done(); // 关闭弹框
      }
    }
  });
};

const changePosition = () => {
  props.formInline.drawingId = null;
  props.formInline.buildingId = null;

  images();
};
const images = () => {
  if (props.formInline.drawingId && props.formInline.position == 1) {
    getImg();
  } else {
    getSettinginfo();
  }
};

onMounted(() => {
  // getDeviceTypeops().then(res => {
  //   if (props.formInline.id && props.formInline.deviceIconInfo) {
  //     res.result.forEach(item => {
  //       if (item.DeviceType == props.formInline.deviceIconInfo.DeviceType) {
  //         props.formInline.deviceIconInfo.DeviceIcon = item.DeviceIcon
  //       }
  //     });
  //   }
  //   iconlist.value = res.result
  // })
  console.log(props.type, "添加类型");

  setTimeout(() => {
    console.log(props.formInline.flowCardId, "流量卡类型");

    // if (props.formInline.flowCardId) {
    //   wifilwk.value = 1;
    // } else if (props.formInline.id && !props.formInline.flowCardId) {
    //   wifilwk.value = 2;
    // }
    if (props.formInline.deviceSN) {
      getdatadeviceinfo();
    } else if (props.type == 2 && props.formInline.productId) {
      getdatadeviceinfo();
    }
    images();
  }, 300);
  setTimeout(() => {
    if (props.formInline.monitorId == 0) {
      props.formInline.monitorId = null;
    }
    if (props.formInline.gatewayId == 0) {
      props.formInline.gatewayId = null;
    }
    if (props.formInline.addressCode == 0) {
      props.formInline.addressCode = null;
    }
    if (props.formInline.rate == 0) {
      props.formInline.rate = null;
    }
    if (props.formInline.buildingId == 0) {
      props.formInline.buildingId = null;
    }
    if (props.formInline.drawingId == 0) {
      props.formInline.drawingId = null;
    }
    if (props.formInline.dutyUid == 0) {
      props.formInline.dutyUid = null;
    }
    if (props.formInline.systematicId == 0) {
      props.formInline.systematicId = null;
    }
  }, 500);
});
defineExpose({ getRef });
</script>
<style lang="scss" scoped>
.pickerW {
  width: 100% !important;
}
</style>
